<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript" src="resources/jquery-2.1.4.js"></script>
    <script type="text/javascript" src="resources/echarts.min.js"></script>
    
    <script type="text/javascript">
    	$(function() {
    		// 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('main'));
    		$.post(
    			'/Java2007Mall/category/selectCategoryCount.action',
    			function(jsonResult) {
    				console.log(jsonResult);
    				var xArray = [];
    				var yArray = new Array();
    				$(jsonResult.data).each(function() {
    					xArray.push(this.name);
    					yArray.push(this.count);
    				});
    				
    				
    				// 指定图表的配置项和数据
    		        var option = {
    		            title: {
    		                text: '分类数量统计'
    		            },
    		            tooltip: {},
    		            legend: {
    		                data:['分类']
    		            },
    		            xAxis: {
    		                data: xArray
    		            },
    		            yAxis: {},
    		            series: [{
    		                name: '数量',
    		                type: 'bar',
    		                data: yArray
    		            }]
    		        };

    		        // 使用刚指定的配置项和数据显示图表。
    		        myChart.setOption(option); 
    			},
    			'json'
    		);
    		
    	});
    
      

        
    </script>
	
</body>
</html>